<template>
  <div class="article__list">
    <!-- 自定义标题 -->
    <!-- 路由传参 -->
    <van-cell :to="'/article/'+article.art_id">
      <div slot="title" class="title">{{ article.title }}</div>
      <div class="common" slot="label">
        <div class="contain-img" v-if="article.cover.type===3">
          <van-image v-for="(item ,index) in article.cover.images" :key="index" fit="cover" :src="item" />

        </div>
        <span>{{article.aut_name}}</span>
        <span class="spns">{{article.comm_count}}评论</span>
        <span>{{article.pudate| forMaterDate}}</span>
      </div>
      <van-image v-if="article.cover.type===1" class="right-img" fit="contain" :src="article.cover.images[0]" />
    </van-cell>
  </div>
</template>

<script>
export default {
  data () {
    return {}
  },
  props: {
    article: {
      type: Object,
      required: true
    }
  }
}
</script>

<style lang="less" scoped>
.article__list {
  // 自定义label
  .common {
    font-size: 23px;
    color: #9999;
    .spns {
      margin: 24px 10px;
    }
    .contain-img {
      margin: 30px 0;
      display: flex;
      .van-image {
        width: 232px;
        height: 146px;
      }
      .van-image:nth-child(2) {
        margin-left: 4px;
        margin-right: 4px;
      }
    }
  }
  .right-img {
    width: 232px;
    height: 146px;
  }
}
</style>>
